<template>
	<view class="top-box">
		<view class="title">cloudMockjs</view>
		<view class="button-group">
			<!-- <text>mehaotian.com</text> -->
			<button size="mini" type="warn" @click="logout">退出</button>
			<!-- <button size="mini" type="warn">登录</button> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			logout() {
				this.$api.check_token().then(res=>{
					this.$api.logout().then(res => {
						console.log(res);
						this.goHome()
					}).catch(err => {
						uni.showModal({
							content: err.message,
							showCancel: false
						})
					})
				}).catch(err=>{
					this.goHome()
				})
				
			},
			goHome(){
				uni.navigateTo({
				    url: '/pages/home/home'
				});
				uni.removeStorageSync('uni_id_token')
				uni.removeStorageSync('uni_id_token_expired')

			}
		}
	}
</script>

<style lang="scss">
	.top-box {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 55px;
		border-bottom: 3px $uni-color-primary solid;
		box-sizing: border-box;

		.title {
			padding-left: 30px;
			font-size: 22px;
			font-weight: bold;
		}

		.button-group {
			display: flex;
			align-items: center;
			padding-right: 20px;
			font-size: 14px;
			color: #2C405A;

			button {
				margin-left: 10px;
			}
		}
	}
</style>
